<template>
  <div class="text_group">
    <div class="input_group" :class="{'is-invalid': error}">
      <!-- 输入框 -->
      <input
        :type="type"
        :placeholder="placeholder"
        :value="value"
        :name="name"
        @input="$emit('input',$event.target.value)"
      >
      <!-- 输入框后面的内容 -->
      <button v-if="btnTitle" @click="$emit('btnClick')" :disabled="disabled">{{btnTitle}}</button>
    </div>
    <!-- 验证提示 -->
    <div v-if="error" class="invalid-feedback">{{error}}</div>
  </div>
</template>
<script>
export default {
  name:"inputGroup",
  props:{
    type: {
      type: String,
      default: "text"
    },
    placeholder:String,
    value:String,
    name:String,
    disabled:Boolean,
    btnTitle:String,  //input框中的文字
    error:String  //验证不正确提示
  }
}
</script>
